<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <style>
    @font-face {
      font-family: "iconfont";
      src: url('http://at.alicdn.com/t/font_2219599_iqvxbzibrs.eot?t=1618471308382');
      /* IE9 */
      src: url('http://at.alicdn.com/t/font_2219599_iqvxbzibrs.eot?t=1618471308382#iefix') format('embedded-opentype'),
        /* IE6-IE8 */
        url('data:application/x-font-woff2;charset=utf-8;base64,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') format('woff2'),
        url('http://at.alicdn.com/t/font_2219599_iqvxbzibrs.woff?t=1618471308382') format('woff'),
        url('http://at.alicdn.com/t/font_2219599_iqvxbzibrs.ttf?t=1618471308382') format('truetype'),
        /* chrome, firefox, opera, Safari, Android, iOS 4.2+ */
        url('http://at.alicdn.com/t/font_2219599_iqvxbzibrs.svg?t=1618471308382#iconfont') format('svg');
      /* iOS 4.1- */
    }

    .iconfont {
      font-family: "iconfont" !important;
      font-size: 16px;
      font-style: normal;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
    }

    .icon-pre:before {
      content: "\e63d";
    }

    .icon-next:before {
      content: "\e600";
    }

    .pagbtn {
      display: flex;
      margin: 0 auto;
      width: 100px;
      justify-content: space-around;
      align-items: center;
    }

    .left,
    .right,
    .center {
      height: 21px;
      line-height: 21px;
    }

    .left,
    .right {
      cursor: pointer;
    }
  </style>
</head>

<body>
  <div class="pagbtn">
    <div class="left">
      <i class="iconfont icon-pre"></i>
    </div>
    <div class="center">
      <span class="cur">1</span> /
      <span class="all"></span>
    </div>
    <div class="right">
      <i class="iconfont icon-next"></i>
    </div>
  </div>


  <script src="http://www.jq22.com/jquery/jquery-1.10.2.js"></script>
  <script>
    $(function () {


      $.ajax({
        url: "https://api.xiaohucloud.com/api/data/productListByCategoryIds",
        data: {
          ids: 5530,
          limit: 999,
          token: '256ad2ed911941ce9674937c6889a3b3M56H9v',
          lang: 'cn',
          type: 1,
          versionId: 2787,
          version_id: 2787,
          companyId: 100504
        },
        type: "GET",
        dataType: "json",
        success: function (data) {
          console.log(data);
          let res = data.data
          let count = Math.ceil(res.length / 6)
          //   console.log(count);
          $('.all').text(count)


          let cur = +$('.pagbtn .cur').text()
          let all = +$('.pagbtn .all').text()
          console.log(cur);
          console.log(all);

          $('.left').on('click', function () {
            console.log('上一页');

            if (cur > 1) {
              cur--
              $('.cur').text(cur)


              // $('#m2c6ht5xi7etc000000 .tr_y.up_page').trigger('click')
            }
            // console.log(cur);
          })

          $('.right').on('click', function () {
            console.log('下一页');
            // console.log(cur,typeof cur);
            // console.log(cur++);
            if (cur < all) {
              cur++
              $('.cur').text(cur)

              // $('#m2c6ht5xi7etc000000 .tr_y.down_page').trigger('click')
            }
            // console.log(cur);
          })
        }
      })

    })

  </script>
</body>

</html>